<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<script th:src="@{/js/bootstrapValidator.js}"></script>
<head>
    <script type="text/javascript">
        /**
         * 添加
         */
        $('#btn_save').click(function () {
            //1. 表单验证
            $('#form').bootstrapValidator('validate');
            var rs  =  $('#form').bootstrapValidator('validate');
            if (rs) {
                //2 如果验证成功发送ajax请求保存角色
                var data = $("#form").serialize();
                var options = {
                    url: '/app/app/apkAdd',
                    type: 'post',
                    dataType: 'json',
                    data: $('#form').serialize(),
                    success: function (data) {
                        if (data) {
                            showAlert('添加成功!',function () {
                                $('#table').bootstrapTable('refresh', {silent: true})
                                $('#modal').modal('hide')
                            });
                        }
                    }
                };
                $.ajax(options);
            }
        });
    </script>
</head>
<body class="fixed-left">
    <form id="form" class="form-horizontal">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
            <h5 class="modal-title" id="exampleModalLabel">添加APK</h5>
        </div>
        <div class="modal-body">
            <div class="container">
                <div class="form-group row">
                    <label for="version" class="col-sm-2 form-control-label">版本名称：</label>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" id="version" name="version" placeholder="请输入版本名称" required data-bv-notempty-message="版本名称不允许为空" >
                    </div>
                </div>
                <div class="form-group row">
                    <label for="verno" class="col-sm-2 form-control-label">版本号：</label>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" id="verno" name="verno" placeholder="请输入版本号" required data-bv-notempty-message="版本号不允许为空" >
                    </div>
                </div>
                <div class="form-group row">
                    <label for="appStoreId" class="col-sm-2 form-control-label">苹果商城编码：</label>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" id="appStoreId" name="appStoreId" placeholder="请输入苹果商城编码" required data-bv-notempty-message="苹果商城编码不允许为空" >
                    </div>
                </div>
                <div class="form-group row">
                    <label for="content" class="col-sm-2 form-control-label">版本说明：</label>
                    <div class="col-sm-10">
                        <textarea class="form-control" id="content" name="content" placeholder="请输入版本说明"></textarea>
                    </div>
                </div>
                <div class="form-group row">
                    <label for="file" class="col-sm-2">APK地址：</label>
                    <div class="col-sm-10">
                        <input type="file" class="form-control form-control-label" id="file" name="file" placeholder="请点击下方按钮上传apk，系统会自动生成APK地址">
                    </div>
                    <input type="hidden" name="apkUrl" id="apkUrl"/>
                </div>
                <div class="form-group row">
                    <div class="form-group">
                        <label class="col-sm-2 form-control-label">是否强制更新：</label>
                        <div class="col-sm-10">
                            <select name="isUpdate" id="isUpdate" class="form-control">
                                <option value="0">是</option>
                                <option value="1">否</option>
                            </select>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="modal-footer">
            <button id="btn_save" type="button" class="btn btn-primary">保存</button>
            <button type="reset" class="btn btn-secondary" >重置</button>
        </div>
    </form>
</body>
<script type="text/javascript">
    $("#file").fileinput({
        theme: 'fa',
        uploadUrl: '/file/upload', // you must set a valid URL here else you will get an error
        allowedFileExtensions: ['jpg', 'png', 'gif','zip','rar','apk'],
        overwriteInitial: false,
        maxFileSize: 1000*200,
        maxFilesNum: 10,
//        showUpload: false,
        showRemove: false,
        slugCallback: function (filename) {
            return filename.replace('(', '_').replace(']', '_');
        }
    }).on("fileuploaded", function(event,data) { //异步上传成功结果处理
        $("#apkUrl").val(data.response.data);
    });
</script>
</html>